import React, { PureComponent } from "react";
import { connect } from "dva";
import Link from 'umi/link';
import { Modal, Row, Col, InputNumber } from "antd";




export default class PlanTime extends PureComponent {
  constructor(props) {
    super(props);
    const value = props.value || {};
    this.state = {
      value1: value.value1 || null,
      value2: value.value2 || null,
    };
  }

  componentDidMount() {

  }


  componentWillReceiveProps(nextProps) {
    // Should be a controlled component.
    if ('value' in nextProps) {
      const value = nextProps.value;
      this.setState(value);
    }
  }

  handleChangeInput = (value1) =>{
    if(value1){
      if (!('value' in this.props)) {
        this.setState({value1});
      }
      this.triggerChange({value1});
    }else{
      // 清空操作
      if (!('value' in this.props)) {
        this.setState({
          value1:null
        });
      }
      this.triggerChange({
        value1:null
      });

    }
  }

  handleChangeInputSec = (value2) =>{
    if(value2){
      if (!('value' in this.props)) {
        this.setState({value2});
      }
      this.triggerChange({value2});

    }else{
      // 清空操作
      if (!('value' in this.props)) {
        this.setState({
          value2:null,
        });
      }
      this.triggerChange({
        value2:null,
      });

    }
  }


  triggerChange = (changedValue) => {
    // Should provide an event to pass value to Form.
    const onChange = this.props.onChange;
    if (onChange) {
      onChange(Object.assign({}, this.state, changedValue));
    }
  }




  render() {
    const { addonAfter ,span, planType } = this.props;
    const { value1,value2 } = this.state;

    // console.log('value1',value1);
    // console.log('value2',value2);

    return (
      <Row gutter={{ md: 8, lg: 24, xl: 48 }}>
        {
          planType=="01" &&
          <Col md={span ? span : 24}  style={{paddingRight:span ? span : 6}}>
            第 <InputNumber onChange={this.handleChangeInput}
                           value={value1 ? value1 : null}
                           max={31}
                           min={1}
                           step={1}
                           precision={0}
          /> 日 {addonAfter}
          </Col>
        }
        {
          planType=="02" &&
          <Col md={span ? span : 24}  style={{paddingRight:span ? span : 6}}>
            第 <InputNumber style={{width:60}}
                           onChange={this.handleChangeInput}
                           value={value1 ? value1 : null}
                           max={5}
                           min={1}
                           step={1}
                           precision={0}
          /> 周的星期 <InputNumber style={{width:60}}
                               onChange={this.handleChangeInputSec}
                               value={value2 ? value2 : null}
                               max={7}
                               min={1}
                               step={1}
                               precision={0}
          />  {addonAfter}
          </Col>
        }
        {
          planType=="03" &&
          <Col md={span ? span : 24}  style={{paddingRight:span ? span : 6}}>
            第 <InputNumber style={{width:60}}
                           onChange={this.handleChangeInput}
                           value={value1 ? value1 : null}
                           max={12}
                           min={1}
                           step={1}
                           precision={0}
          /> 月的第 <InputNumber style={{width:60}}
                              onChange={this.handleChangeInputSec}
                              value={value2 ? value2 : null}
                              max={31}
                              min={1}
                              step={1}
                              precision={0}
          /> 日  {addonAfter}
          </Col>
        }

      </Row>
    );
  }
}
